<template>
  <div class="page-hire-money">
    <ul class="money-list">
      <li class="item van-hairline--bottom" v-for="item in dataList" :key="item.id">
        <div class="img">
          <img v-lazy="item.headimgurl" alt="">
        </div>
        <div class="txt">
          <h4>设计师 - {{item.designerName}}</h4>
          <p>{{item.createTime}}</p>
        </div>
        <div class="num">
          <strong>+{{item.earnestMoney}}</strong>
        </div>
      </li>
    </ul>
  </div>
</template>

<script>
import { moneyInfoList } from '../../api/demand'
export default {
  data(){
    return{
      filter: {
          endDate: "",
          memberId: "",
          payState: 0,
          startDate: ""
      },
      dataList: []
    }
  },
  methods: {
    getDataList(){
      moneyInfoList({}).then(rsp => {
        if(rsp.code === 200 && rsp.data){
          this.dataList = rsp.data
        }
      })
    }
  },
  created(){
    this.getDataList()
  }
}
</script>

<style lang="less">
.page-hire-money{
  background-color: #fff;
  .money-list{
    padding: 10px;
    
    .item{
      display: flex;
      align-items: center;
      padding: 10px;
      &:last-child{
        &:after{
          display: none;
        }
      }
      .img{
        img{
          display: block;
          width: 50px;
          height: 50px;
          border-radius: 50%;
          overflow: hidden;
        }
      }
      .txt{
        flex: 1;
        margin: 0 10px;
        &>h4{
          margin-bottom: 10px;
        }
        &>p{
          font-size: 12px;
          color: #999;
        }
      }
      .num{
        font-weight: bold;
        font-size: 18px;
      }
    }
  }
}
</style>
